<script setup>

	import {GetList} from '^/refund'
	import {ref, reactive} from 'vue'

	const viewData = reactive({
		searchForm: {},
		pageData: [],
		page: {
			current: 1,
			size: 10
		},
		total: 0,

		refundStatusList: [],
	})

	const initData = () => {
		const params = {
			...viewData.searchForm,
			...viewData.page
		}

		GetList(params).then(res => {

			viewData.pageData = res.data.pageData.records
			viewData.total = res.data.pageData.total
			viewData.refundStatusList = res.data.refundStatusList
			viewData.pageData.map((item, index) => {
				console.log('index --->', index);
				console.log('item  ---->', item);
			    var dateString=item.labelTime.replace('T'," ")
				item.labelTime=dateString
				return item;  // 这里可以返回新的内容
			});

		})
	}
	initData()

	const handleChangeCurrent = (val) => {
		viewData.page.current = val
		initData()
	}
</script>

<template>
	<div>
		<el-form :inline="true" ref="formRef" :model="viewData.searchForm">

			<el-form-item>
				<el-input v-model="viewData.searchForm.username" placeholder="昵称" clearable></el-input>
			</el-form-item>
	

			<el-form-item>
				<el-button @click="initData">搜索</el-button>
			</el-form-item>

		</el-form>

		<el-table
			    ref="multipleTable"
				:data="viewData.pageData"
				tooltip-effect="dark"
				style="width: 100%"
				border
				stripe
				@selection-change="handleSelectionChange"
		>

			<el-table-column type="selection" width="55"></el-table-column>
			<el-table-column prop="id" label="ID" width="45"></el-table-column>
			<el-table-column prop="labelKey" label="按键" width="180"></el-table-column>
			<el-table-column prop="userId" label="用户ID" width="180"></el-table-column>
			<el-table-column prop="username" label="用户名" show-overflow-tooltip width="120"></el-table-column>
		
			<el-table-column prop="labelContent" label="按键内容" show-overflow-tooltip width="188"></el-table-column>
			<el-table-column prop="labelTime" label="时间" show-overflow-tooltip width="300"></el-table-column>
			
			<!-- <el-table-column prop="icon" label="操作" width="100"  fixed="right">
				<template #default="scope">
					<el-button type="text" @click="$router.push('/admin/refund/detail?id=' + scope.row.id)">查看退货单</el-button>
				</template>
			</el-table-column> -->

		</el-table>

		<el-pagination background layout="total, prev, pager, next"
		               :total="viewData.total"
		               :page-size="viewData.page.size"
		               @current-change="handleChangeCurrent"
		               style="margin-top: 15px"/>
	</div>
</template>